<template>
  <div>
     <h1>Switch开关</h1>
     <el-switch
       v-model="value"
       active-text="dakai"
       inactive-text="guanbi"
       active-color="#13ce66"
       inactive-color="#ff4949"
       :width="50"
       @change="aa">
     </el-switch>
     <h1>文字描述</h1>
     <el-switch
       v-model="value1"
       active-text="按月付费"
       inactive-text="按年付费">
     </el-switch>
     <el-switch
       style="display: block"
       v-model="value2"
       active-color="#13ce66"
       inactive-color="#ff4949"
       active-text="按月付费"
       inactive-text="按年付费">
     </el-switch>
  </div>

</template>

<script>
  export default{
    name: "Switchs",
    data() {
      return {
        value: true,
         value1: true,
         value2: true
      }
    },
    methods:{
      aa(){
          console.log("zhuangtaibianhua");
        }
    }
    
  }
</script>

<style>
</style>
